<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>小米商城</title>
    <link rel="icon" href="../image/小米图标.ico">
    <link rel="stylesheet" href="./reset.css">
    <link rel="stylesheet" href="./common.css">
    <style>
        .header {
            height: 58px;
        }

        .left-area {
            float: left;
            line-height: 58px;
        }

        .right-area {
            float: right;
            line-height: 58px;
        }

        span
        {
            cursor: pointer;
        }

        span:hover
        {
            color: red;
        }

        /* .list
        {
            margin-right: -14px;
            height: 1000px;
            background-color: orange;
        } */

        .fix
        {
            margin-right: -14px;
        }
        
        .item {
            width: 234px;
            height: 300px;
            background-color: red;
            float: left;
            margin-right:14px;
            margin-top: 14px;
        }
         
        .item1
        {
            height: 614px;
        }

        .item9,.item10
        {
            height: 143px;
        }

        a
        {
            display: inline-block;
            width: 100%;
            height: 100%;
        }

    </style>
</head>

<body>


     
        <div class="header clear-fix box-width">
            <h3 class="left-area">智能穿戴</h3>
            <div class="right-area">
                <span class="hot">热门</span>
                <span class="dress">穿戴</span>
            </div>
        </div>

        <div class="list box-width">
           <div class="fix">
             <div class="item item1"><a href="#"></a></div>
            <div class="item item2"><a href="#"></a></div>
            <div class="item item3"><a href="#"></a></div>
            <div class="item item4"><a href="#"></a></div>
            <div class="item item5"><a href="#"></a></div>
            <div class="item item6"><a href="#"></a></div>
            <div class="item item7"><a href="#"></a></div>
            <div class="item item8"><a href="#"></a></div>
            <div class="item item9"><a href="#"></a></div>
            <div class="item item10"><a href="#"></a></div>
           </div>
        </div>
    

</body>

</html>